{% extends 'template.html' %}
{% load staticfiles %}

{% block username %}
    {{ request.user.username }}
{% endblock %}

{% block content %}
    <div id="page-wrapper">
        <div class="row">
            <div class="col-lg-12">
                <h3 class="page-header">主机迁移/回收申请</h3>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="alert alert-danger alert-dismissable" style="display: none" id="id_error_notice">
                            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;
                            </button>
                            <span id="id_error_text"></span>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-12">标题<small>（最多输入20个字）</small></label>
                            <div class="col-sm-4">
                                <input name="title" id="id_title" class="form-control" placeholder="请输入工单标题" maxlength="20">
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-12">项目</label>
                            <div class="col-sm-4">
                                <select class="form-control" id="id_project" name="project">
                                    <option></option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-12">机房</label>
                            <div class="col-sm-4">
                                <select class="form-control" id="id_room" name="room">
                                    <option></option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-12">运维负责人</label>
                            <div class="col-sm-4">
                                <select class="form-control" id="id_ops" name="ops">
                                    <option></option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-12">操作类型</label>
                            <div class="col-sm-4">
                                <select class="form-control" id="id_type" name="type">
                                    <option></option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-12">IP列表</label>
                            <div class="col-sm-4">
                                    <textarea rows="14" name="ip" id="id_ip" class="form-control"
                                              placeholder="请填写 IP 地址，多个 IP 地址分多行填写"></textarea>
                            </div>
                        </div>
                        <div class="form-group row" style="display: none" id="div_id_migrate_time">
                            <label class="col-sm-12">迁服时间</label>
                            <div class="col-sm-2">
                                <input class="flatpickr flatpickr-input form-control" type="text"
                                       placeholder="选择迁服时间"
                                       data-id="datetime" id="id_action_time" name="action_time">
                            </div>
                            <div class="col-sm-2">
                                <input class="flatpickr flatpickr-input form-control" type="text"
                                       placeholder="选择迁服截止时间"
                                       data-id="datetime" id="id_action_deadline" name="action_deadline">
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-12">回收时间</label>
                            <div class="col-sm-2">
                                <input class="flatpickr flatpickr-input form-control" type="text"
                                       placeholder="选择回收时间"
                                       data-id="datetime" id="id_recover_time" name="recover_time">
                            </div>
                            <div class="col-sm-2">
                                <input class="flatpickr flatpickr-input form-control" type="text"
                                       placeholder="选择回收截止时间"
                                       data-id="datetime" id="id_recover_deadline" name="recover_deadline">
                            </div>
                        </div>
                        <button type="button" class="btn btn-primary" onclick="submit_apply()">提交</button>
                        <a type="button" class="btn btn-default" href="/assets/host_usage/">返回</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
{% block bodyjs %}
    <script src="/static/js/select2.min.js"></script>
    <script src="/static/js/flatpickr.js"></script>
    <script src="/static/js/zh.js"></script>
    <script src="/static/js/host_recover_migration_apply.js?v=20190906001"></script>
{% endblock %}
{% block css %}
    <link href="/static/css/flatpickr.css" rel="stylesheet" type="text/css">
    <link href="/static/css/flatpickr_material_green.css" rel="stylesheet" type="text/css">
    <link href="/static/css/select2-bootstrap.css" rel="stylesheet" type="text/css">
{% endblock %}
